<template>
  <a-modal
    v-model:visible="modalVisible"
    :title="isAudit == 0 ? '查看护理报告' : '审核护理报告'"
    width="80%"
    :footer="null"
    @cancel="cancle"
    class="user-modal"
  >
    <slot>
      <a-form v-if="report" :label-col="labelCol" :wrapper-col="wrapperCol">
        <a-card title="服务信息">
          <a-descriptions bordered :column="{ xxl: 2, xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }">
            <a-descriptions-item label="服务对象">{{ report.userName }}</a-descriptions-item>
            <a-descriptions-item label="服务项目">{{ report.serviceName }}</a-descriptions-item>
            <a-descriptions-item label="服务地址">{{ report.signingAddress }}</a-descriptions-item>
            <a-descriptions-item label="服务护士">{{ report.nurseName }}</a-descriptions-item>
            <a-descriptions-item label="服务时间">{{ report.createdAt }}</a-descriptions-item>
            <a-descriptions-item label="身份证号">{{ report.idCard }}</a-descriptions-item>
          </a-descriptions>
          <a-divider></a-divider>
        </a-card>

        <a-card title=" 护理图片">
          <div v-if="report.signedPicture">
            <a-image v-for="(item, i) in report.signedPicture.split(',')" :key="i" :width="100" :src="item" />
          </div>
        </a-card>
        <!-- <a-card title="患者主诉">{{ nursingRecord.principleAction }}</a-card>
        <a-card title="护理内容">{{ nursingRecord.nursingContent }}</a-card>
        <a-card title="健康指导">{{ nursingRecord.healthGuidance }}</a-card> -->
        <!-- <a-card title="情况评估"></a-card>
        <a-tag color="processing" style="padding: 5px 20px; margin-bottom: 20px"
          >护理图</a-tag
        > -->

        <!-- <a-form-item label="图片">
      
        </a-form-item> -->
        <!-- <a-form-item label="护理后">
          <a-image :width="100" :src="nursingRecord.endPictureUrl" />
        </a-form-item> -->

        <!-- 审核护理报告:未通过 -->
        <!-- <a-card title="拒绝原因" v-if="nursingRecord.reasonForRejection">{{ nursingRecord.reasonForRejection }}</a-card>
        <a-card title="审核信息">
          <div>审核人员：{{ report.checkPerson }}</div>
          <div>审核时间：{{ report.checkTime }}</div>
        </a-card> -->
        <!-- <template v-if="nursingRecord.reasonForRejection">
          <a-form-item label="拒绝原因">{{
            nursingRecord.reasonForRejection
          }}</a-form-item>
        </template> -->
      </a-form>
      <!-- 底部内容 -->
      <a-row v-if="isShowClose">
        <a-col :span="12" :offset="12">
          <a-button type="info" @click="cancle">关闭</a-button>
        </a-col>
      </a-row>
    </slot>

    <!-- 审核护理报告插槽 -->
    <div>
      <slot name="audit"> </slot>
    </div>
  </a-modal>
</template>
<script>
import { onMounted, reactive, ref, toRefs, computed } from 'vue'
import { selectNursingRecordByNumber, selectAdminConfigurationByServiceId } from '@/api/order/index'
import { selectSigningReportById } from '@/api/buisness/index'

export default {
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    number: {
      default: null
    },
    // report: {
    //   type: Object,
    //   default: () => {},
    // },
    // 是否直接展示护理报告
    directShow: {
      type: Boolean,
      default: false
    },
    // 是否审核护理报告
    isAudit: {
      type: Number,
      default: null
    },
    isShowClose: {
      type: Boolean,
      default: true
    }
  },
  setup(props, { emit, attrs }) {
    console.log('11111')

    // const visible = ref(false)
    const modalVisible = computed({
      get: () => props.visible,
      set: val => {
        emit('update:visible', val)
      }
    })

    console.log(modalVisible, '护理报告')
    // 取消，右上角这个关闭也要调用这个方法
    const cancle = () => {
      emit('closeModal')
    }
    console.log('33333333')
    const report = ref({})
    const nursingRecord = ref('')
    const data = reactive({
      arr: [],
      arr1: [],
      arr2: [],
      arr3: [
        {
          fieldNameText: '体温（摄氏度）',
          englishFieldName: 'animalHeat'
        },
        {
          fieldNameText: '脉搏（次/分钟）',
          englishFieldName: 'sphygmus'
        },
        {
          fieldNameText: '呼吸（次/分钟）',
          englishFieldName: 'breathe'
        },
        {
          fieldNameText: '血压（mmHg）',
          englishFieldName: 'bloodPressure'
        }
      ]
    })
    if (!props.directShow) {
      init()
    } else {
      nursingRecord.value = props.report
    }
    async function init() {
      let res = await selectSigningReportById({ signingReportId: props.number })
      if (res.success) {
        report.value = res.object
        // for (let key in res.object.nursingRecord) {
        //   if (!res.object.nursingRecordt[key]) {
        //     res.object.nursingRecord[key] = "未填写";
        //   }
        // }
        //   selectAdminConfigurationByServiceId({
        //     serviceId: res.object.serviceId
        //   }).then(r => {
        //     data.arr = r.object
        //     initData()
        //   })
        //   let obj = res.object.nursingRecord
        //   obj.staPictureUrl = obj.staPictureUrl.split(',')
        //   nursingRecord.value = res.object.nursingRecord
      }
    }
    // async function initData() {
    //   let arr = data.arr.filter(r => r.isisDele != 1)
    //   arr.map(m => {
    //     if (m.fieldBelong != 1) {
    //       data.arr1.push(m)
    //     } else {
    //       m.options = JSON.parse(m.choiceType)
    //       // m.options = arr1.map(a =>  {
    //       // 	return {
    //       // 		text:a.name,
    //       // 		value:a.value
    //       // 	}
    //       // })
    //       data.arr2.push(m)
    //     }
    //     return m
    //   })
    //   console.log(data.arr1, 'arr1------')
    //   console.log(data.arr2, 'arr2------')
    // }
    onMounted(() => {})
    return {
      ...toRefs(data),
      modalVisible,
      labelCol: {
        style: {
          width: '100px',
          fontWeight: 'bolder'
        }
      },
      wrapperCol: {
        span: 20,
        offset: 1
      },
      cancle,
      report,
      nursingRecord
    }
  }
}
</script>
<style scoped>
.ant-form-item {
  margin-bottom: 10px;
}
</style>
